<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>03_元素属性操作</title>
		<!-- 元素属性操作：针对元素中属性
		 元素：固定属性  attr() removeAttr() 针对元素自带属性 捆绑型
		      附加属性  prop() removeProp()  针对表单元素  附加型
			  特点：固定属性和附加属性【两对函数使用方式一致】
			  prop()         功能：表单元素：input元素  添加获取属性值的方法
			                 有参 传一个值
							 功能：表单元素中的附加属性【checked disabled】
							 input 元素中属性checked添加bool布尔值
							 获取input 元素中属性checked的布尔值 【是否选中状态】
							 添加bool值 获取input元素布尔值
							 语法：prop("属性")
							      传两个值
							 语法：prop("属性""属性值：bool")
							 功能：设置input元素中属性状态【true设置选中 fasle 未选中】
			  removeProp()   
			  -->
			  <script src="../js/jquery-1.11.1.js"></script>
	</head>
	<body>
		<h1>prop()函数与removeProp()函数使用</h1>
		<!-- 复选框  id="myCheckbox" checked选中-->
		学生<input type="checkbox" id="myCheckbox" checked="checked"/>
		<button id="getProBtn">获取属性</button>
		<button id="setProBtn">设置属性</button>
		<button id="removeProBtn">移除属性</button>
		<div id="output"></div>
		<script>
			//3.
			$("#removeProBtn").click(function(){
				$("#myCheckbox").removeProp("checked");
				$("#output").text("已被移除");
			});
			
			
			//2.设置属性值--实现多选钩掉
			$("#setProBtn").click(function(){
				$("#myCheckbox").prop("checked",false);
				$("#output").text("你获取的checked值是:"+false);
			});
			
			
			
			
			// 1.获取属性值 ---点击getProBtn--获取到input元素中checked值【布尔型】
			//output提示  你获取的checked值是＋变量
			$("#getProBtn").click(function(){
				var mcb=$("#myCheckbox").prop("checked");
				$("#output").text("你获取的checked值是:"+mcb);
			});
			
		</script>
	</body>
</html>